<template>
  <div>
    <van-tabs 
      animated 
      swipeable
      @click="onChange"
    >
      <van-tab 
        v-for="(item,index) in tab" 
        :title="item"
        :key="index"
        v-model="active"
      />
    </van-tabs>
    <p v-if="active==0">0</p>
    <p v-if="active==1">1</p>
    <p v-if="active==2">2</p>
    <p v-if="active==3">3</p>
  </div>
</template>

<script>
import Logo from '~/components/Logo.vue'

export default {
  components: {
    Logo
  },

  data() {
    return {
      tab: ['全国', '地方', '高频', '竞技'],
      active: 0
    }
  },
  asyncData({ app, query }) {
    // let idUrl = query.id
    // return app.$axios
    //   .get(`http://vk.cuixiangping.com:81/home/wxapi/config_info`)
    //   .then(res => {
    //     console.log(res.data)
    //     return { title: res.data }
    //   })
  },
  mounted() {
    this.city()
  },
  methods: {
    onChange(index, title) {
      console.log(index)
      this.active = index
    },
    city() {
      this.$axios.get(`/list`).then(res => {
        console.log(res.data)
      })
    }
  }
}
</script>

<style>
</style>
